
<script>
import { doTreeAdd, getAppendData } from '@/api/treeDefintion/dataMaintenance'
export default {
  name: 'DataMaintenanceForm',
  data() {
    return {
      dialogVisible: false,
      infoForm: {},
      title: this.$t('add'),
      rules: {
        dataValue: [{ required: true, message: `${this.$t('pleaseSelect')}${this.$t('EnumCheckItemJudgeType_Value')}`, trigger: 'blur' }]
      }
    }
  },
  methods: {
    doSave() {
      this.$refs['dataForm'].$refs['dynForm'].validate((valid) => {
        if (valid) {
          doTreeAdd(this.infoForm).then(res => {
            this.$betterTips(res, this.handleClose, this.handleUpdate)
          })
        }
      })
    },
    async handleOpen(row) {
      console.log(row)
      const res = await getAppendData(this.$clearNull({ treeId: row.treeId, levelId: row.levelId, id: row.id }))
      this.infoForm = res.data
      this.dialogVisible = true
      this.$nextTick(() => {
        this.$refs['dataForm'].$refs['dynForm'].clearValidate()
      })
    },
    handleClose() {
      Object.assign(this.$data, this.$options.data.call(this))
    },
    handleUpdate() {
      this.$emit('initList')
    }
  },
  render(h) {
    const searchTags = [
      { label: this.$t('dataName'), prop: 'treeName', tag: 'DynInput', width: '100%', disabled: true },
      { label: this.$t('elementName'), prop: 'elementName', tag: 'DynInput', width: '100%', disabled: true },
      { label: this.$t('EnumCheckItemJudgeType_Value'), prop: 'dataValue', tag: 'DynInput', width: '100%' },
      { label: this.$t('order'), prop: 'orderNo', tag: 'DynInput', width: '100%', event: (value) => {
        this.infoForm.sort = value.replace(/[^\d]/g, '')
      } }
    ]
    return (
      <el-dialog
        visible={this.dialogVisible} {...{ on: 'update:visible' }}
        before-close={this.handleClose}
        close-on-click-modal={false}
        title={this.title}
        width='30%'>
        <dynForm
          labelWidth='120px'
          ref='dataForm'
          info-form={this.infoForm}
          search-tags={searchTags}
          rules={this.rules}/>
        <span slot='footer'>
          <el-button size='small' icon='el-icon-circle-close' on-click={this.handleClose}>
            {this.$t('cancel')}
          </el-button>
          <el-button
            v-btnThrottle={this.doSave}
            type='primary'
            icon='el-icon-receiving'
            size='small'
          >{this.$t('save') }</el-button>
        </span>
      </el-dialog>
    )
  }
}
</script>

<style scoped lang="scss">
::v-deep .el-form .el-form-item {
    width: 100%;
    .el-form-item__content{
        width: 60%;
    }
}
</style>
